<template>
	<view>
		<view class="search-box">
			<u-search placeholder="搜索" v-model="keyword" @change="search" shape="round" :show-action="false"bg-color="#fff" ></u-search>
		</view>
		<view class="main">
			<view class="max-big-box" v-for="(item,index) in search()" :key="index">
				<view class="big-box">
					<view class="left-box">
						<view class="left-newline-a">车名：{{item.name}}</view>
						<view class="left-newline-b">车号：<span>{{item.trainNo}}</span></view>
						<view class="left-newline-c">状态：<span>{{item.productionState}}</span></view>
					</view>
					<view class="right-box">
						<view class="right-newline-a" v-if="item.paintLine!=null">油漆线：<span>{{item.paintLine.name}}</span></view>
						<view class="right-newline-a" v-if="item.paintLine==null">油漆线：<span></span></view>
						<view class="right-newline-a">车型：<span>{{item.trainModel.name}}</span></view>
						<view class="right-newline-a">转向架型号：<span>{{item.carBogie.name}}</span></view>
					</view>
				</view>
				<view class="bottom-box" @click="jump(item,index)">
					<view><span>配送</span></view>
				</view>
			</view>
			<view v-if="this.allListItem==true" class="ending">
				没有更多数据了
			</view>
		</view>
	</view>
</template>

<script>
	import { ProcessBodyDropOffApi } from "../pages/drop/api/index.js"
	export default {
		name:"distribution",
		data() {
			return {
				keyword:'',//搜索框的值
				dataList:[
					
					
				],//存放数据
				pageSize:10,//个数
				pageNum:0,//页数
				total:'',//总数
				allListItem:false,//控制加载是否完成
			};
		},
		created() {
			let params = {
				 state: '0',
				 category: 'CAR_BOGIE',
				 sort: 'id,desc',
				 page:0,
				 size:10
			}
			ProcessBodyDropOffApi.bogieDistributionList(params).then(res=>{
				console.log(res);
				this.total=res.data.totalElements
				// this.dataList=res.data.content
				res.data.content.forEach((item,index) =>{
					let str = ()=>{
						switch (item.productionState) {
							case 'NOT_BEGIN':
								return 'ERP开工';
							case 'BREAK_FINISHED':
								return '制动解体完工';
							case 'ABRASIVE_FINISHED':
								return '抛丸完工';
							case 'DECOMPOSE':
								return '解体开工';
							case 'RATING':
								return '已评级';
							case 'SCHEDULE_PRESET':
								return '已分车';
							case 'SCHEDULE_CONFIRM':
								return '钢结构开工';
							case 'STEELY_FINISHED':
								return '钢结构完工';
							case 'PAINT_START':
								return '油漆开工';
							case 'ASSEMBLY_PROCESS':
								return '总装完工';
						}
					}
						
					item.productionState = str()
				})
				this.dataList = res.data.content;
			})
		},
		mounted() {
			uni.$on('onReachBottomb',()=>{
				// console.log(data);
				// console.log("第三页");
				var allTotal = (this.pageNum+1) * this.pageSize
				console.log(allTotal);
				console.log(this.total);
				if(allTotal < this.total) {
					this.allListItem =  false;
					this.pageNum ++;
					// console.log(this.pageNum);
					this.getMoreList()
					console.log(this.dataList);
				} else {
					this.allListItem = true;
					console.log('已加载全部数据')
				}
			})
		},
		methods:{
			
			getMoreList(){
				let params = {
					 state: '0',
					 category: 'CAR_BOGIE',
					 sort: 'id,desc',
					 page:this.pageNum,
					 size:this.pageSize
				}
				ProcessBodyDropOffApi.bogieDistributionList(params).then(res=>{
					console.log(res);
					res.data.content.forEach((item,index) =>{
						let str = ()=>{
							switch (item.productionState) {
								case 'NOT_BEGIN':
									return 'ERP开工';
								case 'BREAK_FINISHED':
									return '制动解体完工';
								case 'ABRASIVE_FINISHED':
									return '抛丸完工';
								case 'DECOMPOSE':
									return '解体开工';
								case 'RATING':
									return '已评级';
								case 'SCHEDULE_PRESET':
									return '已分车';
								case 'SCHEDULE_CONFIRM':
									return '钢结构开工';
								case 'STEELY_FINISHED':
									return '钢结构完工';
								case 'PAINT_START':
									return '油漆开工';
								case 'ASSEMBLY_PROCESS':
									return '总装完工';
							}
						}
							
						item.productionState = str()
						this.dataList.push(item)
					})
					
					console.log(this.dataList);
				})
			},
			
			
			
			search(){
				// console.log(11);
				   return  this.dataList.filter(item => item.trainNo.includes(this.keyword))
			},
			jump(e,index){
				console.log(e);
				uni.showModal({
					title: '提示',
					content: '确认要配送吗',
					success: function (res) {
						if (res.confirm) {
							this.dataList.splice(index,1)
							// console.log('用户点击确定');
							ProcessBodyDropOffApi.bogieDistributionSave({id:e.id}).then(res=>{
								console.log(res);
								uni.showToast({
									title:"操作成功"
								})
							})
						} else if (res.cancel) {
							// console.log('用户点击取消');
						}
					}.bind(this)
				});
			},
		},
	}
</script>

<style lang="scss" scoped>
.search-box {
		height: 100rpx;
		padding: 0rpx 20rpx;
		line-height: 100rpx;
		border-bottom: 1px solid #ddd;
		background-color: #efefef;
	}
	.main {
		padding: 16rpx 20rpx;
		// height: calc(100vh - 300rpx);
		height: calc(100vh - 290rpx);
		overflow: scroll;
		background-color: #efefef;
	}
.max-big-box {
	// width: 100%;
	// height: 280rpx;
	background-color: #fff;
	border-radius: 10px;
	margin-top: 20rpx;
}
.big-box {
	// width: 100%;
	// height: 200rpx;
	display: flex;
	justify-content: space-around;
	padding: 20rpx 20rpx 20rpx 10rpx;
	margin-left: 20rpx;
	font-size:30rpx;
    color: #999999;
}
.left-box>view:nth-of-type(2) {
	margin-top: 20rpx;
	margin-bottom: 10rpx;
}
.right-box>view:nth-of-type(2) {
	margin-top: 20rpx;
	// margin-left:-90rpx;
}
.right-box>view:nth-of-type(3) {
	margin-top: 10rpx;
	// margin-left: -88rpx;
}
.bottom-box {
	// width: 100%;
	// height: 90rpx;
	text-align: center;
	line-height: 80rpx;
	font-size: 30rpx;
    color: #0079FE;
	border-top: 1px solid #ddd;
}
.left-newline-a {
	width: 380rpx;
}
.left-newline-b {
	width: 292rpx;
}
.left-newline-c {
	width: 292rpx;
}
.right-newline-a {
	width: 300rpx;
}
.right-newline-b {
	width: 374rpx;
}
.right-newline-c {
	width: 372rpx;
}

.ending {
		font-size: 34rpx;
		text-align: center;
		color: #dedede;
	}

</style>
